const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
// const MiniCssExtractPlugin=require('mini-css-extract-plugin');
const resolve=dir=>path.resolve(__dirname,dir); 
module.exports = {
  mode: 'production',
  entry: {
    index:'./src/pages/index',
    destination:'./src/pages/destination',
    personal:'./src/pages/personal',
    details:'./src/pages/details',
  },
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: 'js/[name].js'
  },
  devtool:'cheap-module-eval-source-map',
  resolve:{
    extensions:['.js'],
    alias:{
      api:resolve('src/api'),
      icons:resolve('src/assets/icons'),
      utils:resolve('src/utils'),
      styles:resolve('src/assets/styles'),
      components:resolve('src/components'),
      pages:resolve('src/pages')
    }
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        loader: 'babel-loader'
      },
      {
        test:/.\.css$/,
        use:[
        //   {
        //   loader:MiniCssExtractPlugin.loader,
        //   options:{
        //     publicPath:'../'
        //   }
        // },
        'style-loader','css-loader']
      },
      {
        test:/\.(jpe?g|png|gif)$/,
        use:{
          loader:'url-loader',
          options:{
            name:'img/[name].[ext]',
            esModule:false,
            limit:10000
          }
        }
      },
      {
        test:/\.(woff2?|eot|ttf|otf|svg)$/,
        loader:'url-loader',
        options:{
          limit:10000,
          name:'fonts/[name].[ext]'
        }
      },
      {
        test:/\.(htm|html)$/,
        loader:'html-withimg-loader'
      },
      {
        test:/\.art$/,
        loader:'art-template-loader'
      }
    ]
  },
  plugins: [
    new HtmlWebpackPlugin({
      filename:'index.html',
      template: './src/pages/index/index.art',
      chunks:['index'],
    }),
    new HtmlWebpackPlugin({
      filename:'destination.html',
      template: './src/pages/destination/destination.art',
      chunks:['destination'],
    }),
    new HtmlWebpackPlugin({
      filename:'personal.html',
      template: './src/pages/personal/personal.art',
      chunks:['personal'],
    }),
    new HtmlWebpackPlugin({
      filename:'details.html',
      template: './src/pages/details/details.art',
      chunks:['details'],
    }),
    // new MiniCssExtractPlugin({
    //   filename:'css/[name].css'
    // })
  ]
};